<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello React!</title>
<!-- 先引入react,再引入react-dom,因为react是核心库，react-dom是扩展库 -->
<!-- 引入以后全局多了一个REACT和ReactDOM对象 -->
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<!-- 用于将jsx转为js,不用jsx就把这个注释掉 -->
<!-- <script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script> -->
</head>
<body>
<!-- 准备好一个容器 -->
<div id="example"></div>
<!-- 这里我们用js创建虚拟dom -->
<script type="text/javascript">

// 1.创建虚拟DOM(标签名，标签属性，标签内容),加一个span标签，不能把标签内容改为<span>你好世界</span>,我们得套娃
const VDOM = React.createElement('h1', {id:'title'},'你好世界')
// const VDOM = React.createElement('h1', {id:'title'},React.createElement('span', {},'你好世界'))
// 2.渲染虚拟dom到页面
ReactDOM.render(
	VDOM,
	document.getElementById('example')
);
</script>

</body>
</html>